          <div class="wrapper">
              <p style="font-size: 20px; color: #aac;">swiper</p>
               <style>
              /* Demo Styles */
              .swiper-container {
                width: 640px;
                height: 250px;
                color: #fff;
                text-align: center;
              }
              .red-slide {
                background: #ca4040;
              }
              .blue-slide {
                background: #4390ee;
              }
              .orange-slide {
                background: #ff8604;
              }
              .green-slide {
                background: #49a430;
              }
              .pink-slide {
                background: #973e76;
              }
              .swiper-slide .title {
                font-style: italic;
                font-size: 42px;
                margin-top: 80px;
                margin-bottom: 0;
                line-height: 45px;
              }
              .swiper-slide p {
                font-style: italic;
                font-size: 25px;
              }
              .pagination {
                position: absolute;
                z-index: 20;
                left: 10px;
                top: 10px;
              }
              .swiper-pagination-switch {
                display: block;
                width: 8px;
                height: 8px;
                border-radius: 8px;
                background: #555;
                margin: 0 0px 5px;
                opacity: 0.8;
                border: 1px solid #fff;
                cursor: pointer;
              }
              .swiper-active-switch {
                background: #fff;
              }
              </style>
              <div class="swiper-container">
                <div class="swiper-wrapper">
                  <div class="swiper-slide blue-slide">
                    <div class="title">Vertical Mode</div>
                    <p>Swipe to the Top or to the Bottom</p>
                  </div>
                  <div class="swiper-slide red-slide">
                    <div class="title">Slide 2</div>
                    <p>Keep swiping</p>
                  </div>
                  <div class="swiper-slide orange-slide">
                    <div class="title">Slide 3</div>
                    <p>The last one</p>
                  </div>
                </div>
                <div class="pagination"></div>
              </div>
              <p style="font-size: 20px; color: #aac;">日历</p>
              <input type="text" class="form-control pull-right" id="datepicker3">

              <p style="font-size: 20px; color: #aac;">验证</p>
              <div ng-controller="democtrl">
                  <p>{{aa}}</p>
                  <div>
                  <input type="text" class="" id="r1">
                  <p style="display: none;" id="r1s">不能为空</p>
                </div>
                <div>
                  <input type="text" class="" id="r2">
                  <p style="display: none;" id="r2s">不能为空</p>
                </div>
                <div>
                  <input type="button" value="提交" class="" id="btn" ng-click="subfun()" /> 
                </div>
              </div>

              <p style="font-size: 20px; color: #aac;">邮箱提示补全</p> 
              <input type="text" id="input_ed_email" name="" placeholder="请输入邮箱" /> 

              <p style="font-size: 20px; color: #aac;">头像裁剪</p>
              <div class="uploaderbox">
                  <!-- 上传按钮 -->
                  <div id="uploader-demo">
                      <div id="fileList" class="uploader-list"></div>
                      <div id="filePicker">选择图片</div>
                  </div>
                  <!-- 参数信息 -->
                  <div id="uploader-demo-show" style="display: none;">
                     <img src="" id="uploader-demo-img">
                      <p id="uploader-demo-id"></p>
                      <p id="uploader-demo-name"></p>
                      <p id="uploader-demo-size"></p>
                      <p id="uploader-demo-type"></p>
                      <p id="uploader-demo-ext"></p>
                      <p id="uploader-demo-err"></p>
                  </div>
                  <!-- 裁剪处理 -->
                  <div id="uploader-cut" class="uploader-cut" style="width: 300px;height: 300px;">
                      <img class="img-responsive cropper-hidden" id="image" src="../../static/main/img/photo_setting.png" alt="Picture">
                      <div id="uploader-ppreview" class="uploader-ppreview01" style="width: 100px;height: 100px;">
                          <div class="preview"></div>
                      </div>
                      <div id="uploader-ppreview" class="uploader-ppreview02" style="width: 70px;height: 70px;">
                          <div class="preview"></div>
                      </div>
                      <div id="uploader-ppreview" class="uploader-ppreview03" style="width: 40px;height: 40px;">
                          <div class="preview"></div>
                      </div>
                  </div>
                  <div class="uploader-todata" style="display: none;">
                      <div id="uploader-canvas"></div>       
                  </div>
                  <img src="" id="uploader-save-img" class="uploader-save-img">   
                  <div id="uploader-save" class="uploader-save">保存</div>
                  <!-- <div id="uploader-clear" class="uploader-save">重置</div> -->
              </div>  

              <p style="font-size: 20px; color: #aac;">jq load结构</p>
              <div id="jqload">
                
              </div>

              <p style="font-size: 20px; color: #aac;">自定义指令</p>
              <div>
                <me-world></me-world>
                <super-world></url-super>
              </div>  

                  
          </div>




<script>
//swiper
 var mySwiper = new Swiper('.swiper-container',{
    pagination: '.pagination',
    paginationClickable: true
  })
  //日历控件   融资信息注册时间
    $('#datepicker3').datepicker({
        language: 'zh-CN',
        autoclose: true,
        todayHighlight: true,
        format: 'yyyy-mm-dd'
    }).on("changeDate", function(e) {
        $("#errcon_iie_rzregtime").hide();
    });
    //验证
    var regconfig=[
        {eleinput:"r1",eletext:"r1s",rule:[{reg:/^.+$/,text:'不能为空'}]},
        {eleinput:"r2",eletext:"r2s",rule:[{reg:/^.+$/,text:'不能为空'}]}
    ];
    emaJgl.blurValidate(regconfig);
    //头像裁剪
    funimagecropper();
    //邮箱自动不全   
    emaJgl.TbdAutoEmail.keydownevent=function(showid){
      alert(showid);
    };
    new emaJgl.TbdAutoEmail({
      inputid:"input_ed_email",
      selectsuccess:function(){
        
      },
      regpass:function(){
          
      },
      regerr:function(){
          
      }
    }).init();  
  
    //end
</script>